{% extends '../../common/layouts/layout.tpl' %}

{% block css_assets %}
{% endblock %}

{% block js_assets %}
    <script>

        //查看详情
        var detailIns;
        function showDetail(id) {
            layui.use(['table'], function () {
                var table = layui.table;
                detailIns = table.render({
                    elem: '#detail_table'
                    , url: '/sale/deduct/detail'
                    ,where:{
                        id:id
                    }
                    , cols: [[
                        {field: 'company', title: '日期', sort: true, align: 'center'}
                        , {field: 'department',  title: '客户编号', sort: true, align: 'center'}
                        , {field: 'team', title: '客户姓名', sort: true, align: 'center'}
                        , {field: 'amount', title: '提成金额(元)', sort: true, align: 'center'}
                    ]]
                    , page: true
                    , method: 'post'
                    , response: {
                        statusName: 'status' //数据状态的字段名称，默认：code
                        , statusCode: 200 //成功的状态码，默认：0
                        , msgName: 'msg' //状态信息的字段名称，默认：msg
                        , countName: 'count' //数据总数的字段名称，默认：count
                        , dataName: 'datas' //数据列表的字段名称，默认：data
                    }
                });

                layer.open({
                    type: 1,
                    title: "提成明细",
                    area: ['1000px', 'auto'], //宽高
                    content: $("#detail")
                });
            });
        }

        //提成列表
        var tableIns;
        layui.use(['form', 'laydate', 'table'], function () {
            //日期
            var laydate = layui.laydate;
            laydate.render({
                elem: '#start_t'
                , type: 'datetime'
            });
            laydate.render({
                elem: '#end_t'
                , type: 'datetime'
            });

            //填充表单数据
            var table = layui.table;
            tableIns = table.render({
                elem: '#test'
                , url: '/sale/deduct/list'
                , cols: [[

                        {field: 'change_time', title: '提成日期', align: 'center',},
                        {field: 'change_time', title: '提成金额(元)', align: 'center',templet:function (row){
                        {
                            return '<a onclick="showDetail(\'' + row.id + '\')"  href="javascript:;">' + row.total_amount + '</a>'
                        }
                        }},

                ]]
                , page: true
                , response: {
                    statusName: 'status' //数据状态的字段名称，默认：code
                    , statusCode: 200 //成功的状态码，默认：0
                    , msgName: 'msg' //状态信息的字段名称，默认：msg
                    , countName: 'count' //数据总数的字段名称，默认：count
                    , dataName: 'datas' //数据列表的字段名称，默认：data
                }
            });

            //监听搜索按钮
            var form = layui.form;
            form.on('submit(search_btn)', function (data) {
                search(data.field);
                return false;
            });
        });

        function search(search_form_data) {
            console.log(search_form_data)
            tableIns.reload({
                where: { //设定异步数据接口的额外参数，任意设
                    start_t: search_form_data.start_t
                    , end_t: search_form_data.end_t
                }
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        }
    </script>
{% endblock %}


{% block content %}

    <div class="main_content">
        <div class="main_content_holder">
            <div id="fund">
                <div class="main_head">
                    <div class="main_head_unit">
                        提成列表
                    </div>
                    <div id="search_box">
                        <form class="layui-form" action="">

                            <div class="layui-input-inline">
                                <input class="layui-input" id="start_t" name="start_t" placeholder="开始时间" type="text" value="" >
                            </div>
                            <div class="layui-input-inline">
                                -
                            </div>
                            <div class="layui-input-inline">
                                <input class="layui-input" id="end_t" name="end_t" placeholder="结束时间" type="text" value="">
                            </div>

                            <div class="layui-input-inline">
                                <button class="layui-btn" lay-submit="" lay-filter="search_btn">查询</button>
                                <button type="reset" class="layui-btn layui-btn-primary">清空</button>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="main_page_Info">
                    <table class="layui-hide" id="test"></table>
                </div>
            </div>
        </div>
    </div>


    <div id="detail" style="display:none">


        <div class="main_page_Info">
            <table class="layui-hide" id="detail_table"></table>
        </div>
    </div>

{% endblock %}
